<template>
  <div class="container">
    <xy-table
      ref="table"
      :api="api"
      :columns="columns"
      :param="args"
      :on-edit="editItem"
      :on-delete="deleteItem"
    >
      <template #addItem>
        <search-header :model="args" :on-search="onSearch">
          <template #operation="">
            <el-form-item class="col-1">
              <el-button size="mini" @click="addItem2" icon="el-icon-plus">
                {{ $language.local("Add") }}
              </el-button>
            </el-form-item>
          </template>
        </search-header>
      </template>
    </xy-table>
    <el-dialog
      :title="titleDlg"
      :close-on-click-modal="false"
      :destroy-on-close="true"
      width="86%"
      :visible.sync="addDialogVisible"
    >
      <merchant-detail
        :model="formData"
        :apiName="apiName"
        :id="merchantId"
      ></merchant-detail>
    </el-dialog>
  </div>
</template>

<script>
import API from "../../plugins/api";
import MerchantDetail from "./MerchantDetail.vue";
export default {
  inject: ["reload"],
  components: {
    "merchant-detail": MerchantDetail,
  },
  data() {
    return {
      apiName: "/api/Merchant/Create",
      api: new API("/api/Merchant/"),
      addDialogVisible: false,
      titleDlg: "添加客户",
      columns: {
        customerName: "",
        merchant_number: "",
        customLegalPerson: "",
        customCollectorPhone: "",
        // customerTelephone: "",
        // customTaxIdcd: "",
        // IdNumber: "",
        customerManager: "",
        Indate: "",
        CheckStatus: "",
        // customCollector: "",
        // customMail: "",
        // areaName: "",
        // // CheckStatus: 0,
        // InviteCode: "",
        // BusinessScope: "",
        // BusinessModel: "",
      },
      args: {
        CheckStatus: "",
      },
      formData: {},
      merchantId: "",
    };
  },
  created() {},
  methods: {
    addItem() {
      this.$router.push("add-merchant");
    },
    addItem2() {
      // this.addDialogVisible = true;
      this.$router.push("merchantlist/add-merchant2");
    },
    editItem(row) {
      console.log(row);
      let action = "Edit";
      let apiName = "/api/Merchant/Edit";
      let merchantId = row.Id;
      this.$router.push({
        name: "客户信息",
        query: { action, apiName, merchantId },
      });
      // this.merchantId = row.Id;
      // this.apiName = "/api/Merchant/Edit";
      // this.addDialogVisible = true;
    },
    async deleteItem(row) {
      await this.$http.delete(`/api/Merchant/Delete/${row.Id}`);
      this.reload();
    },
    onSearch(e) {
      // this.params = e;
      console.log(e);
      console.log(this.$refs.table);
      this.$refs.table.getData(e);
    },
  },
};
</script>
<style lang="less" scoped>
.upload-demo {
  width: 100%;
  .upload-demo-trigger {
    width: 100%;
  }
}
</style>
